import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'
import PropTypes from 'prop-types'
import zhCN from 'antd/locale/zh_CN'

import { ConfigProvider, App } from 'antd'
import { lazy, Suspense, useState } from 'react'
import { BrowserRouter, useRoutes } from 'react-router-dom'

import { useFavicon } from 'ahooks'

import { IndexedDBFun } from '../Utils/IndexedDB'
import { imageUrl } from '../Config/config'

dayjs.locale('zh-cn')

const Log = lazy(() => import('../Log'))
const Admin = lazy(() => import('../Admin'))
const Start = lazy(() => import('../Start'))
const Loading = lazy(() => import('../View/Loading/LoadSvg'))

const index = () => {
    useFavicon(imageUrl + 'Ico.ico')
    window.webDB = IndexedDBFun()
    const [Router] = useState([
        { path: '/', element: <Log /> },
        { path: 'Admin', element: <Admin /> },
        { path: 'Start', element: <Start /> },
    ])

    const Routes = ({ data }) => {
        Routes.propTypes = { data: PropTypes.object }
        return useRoutes(data)
    }


    return (
        <ConfigProvider locale={zhCN} theme={{ token: { colorPrimary: '#13c2c2' } }}>
            <App>
                <BrowserRouter>
                    <Suspense fallback={<Loading />} >
                        <Routes data={Router} />
                    </Suspense>
                </BrowserRouter>
            </App>
        </ConfigProvider>
    );
};

export default index;